<!DOCTYPE html>
<html lang="en"
      xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>我的委托</title>
    <script src="../js/jquery-3.5.1.min.js"></script>
    <link href="../layui-v2.6.4/layui/css/layui.css" rel="stylesheet" type="text/css"/>
    <link href="../layui-v2.6.4/layui/css/modules/code.css" rel="stylesheet" type="text/css"/>
    <script charset="utf-8" src="../layui-v2.6.4/layui/layui.js" type="text/javascript"></script>
    <script>
        layui.use('element', function () {
            var element = layui.element;
        });

        function toThisEnt(ele) {
            // location.assign("/toOrderInfo?id=" + ele)
            layer.msg("详细信息");
        }

        function xianshi(e) {
            layer.tips($(e).text(), "#" + e.id, {
                tips: [
                    Math.floor(Math.random() * 3) + 1,
                    '#' + ('00000' + (Math.random() * 0x1000000 << 0).toString(16)).substr(-6)
                ]
            })
        }

        function tip() {
            layer.tips("欸嘿", "#i")
        }
    </script>
</head>
<body>
<div class="layui-container">
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;border-color: #3e0656;">
        <legend>待完成的订单</legend>
    </fieldset>
    <div class="layui-row"
         style="height: 50px;border-bottom: 1px solid #2b2767;padding: 20px;text-align: center;font-size: large;">
        <div class="layui-col-md2 layui-col-lg2 layui-col-sm2 layui-col-xs2 layui-elip">委托类型</div>
        <div class="layui-col-md5 layui-col-lg5 layui-col-sm5 layui-col-xs5 layui-elip">委托内容<i class="layui-icon" id="i"
                                                                                               onmouseover="tip()">&#xe60b;</i>
        </div>
        <div class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1 layui-elip">成交价</div>
        <div class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1  layui-elip">委托人</div>
        <div class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1  layui-elip">发布时间</div>
        <div class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1  layui-elip">最后期限</div>
        <div class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1 ">操作</div>
    </div>
    <div id="searchRongqi"></div>
</div>
<script th:inline="javascript" type="text/javascript">
    var entrustTypeList = /*[[${myentrustTypeList}]]*/ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
    var entrustDataList = /*[[${myentrustDataList}]]*/ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
    var entrustUserList = /*[[${myentrustUserList}]]*/ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
    var entrustIdList = /*[[${myentrustIdList}]]*/ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
    var entrustStartTime = /*[[${myentrustStartTime}]]*/ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
    var entrustEndTime = /*[[${myentrustEndTime}]]*/ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
    var entrustMoney = /*[[${myentrustMoney}]]*/ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
    var pages = /*[[${myLeisureEntrustspages}]]*/2;
    layui.use('flow', function () {
        var flow = layui.flow;
        flow.load({
            elem: '#searchRongqi', //流加载容器
            scrollElem: '#searchRongqi',
            isAuto: true,
            isLazyimg: true,
            end: '到底了哦',
            done: function (page, next) {
                setTimeout(function () {
                    var lis = [];
                    var limit = 5;
                    if (page == pages) {
                        limit = entrustTypeList.length - 5 * (page - 1);
                    }
                    for (var i = 0; i < limit; i++) {
                        lis.push(
                            '<div class="layui-row" style="height: 50px;border-bottom: 1px solid #2b2767;padding: 20px;text-align: center;font-size: large;">' +
                            '<div class="layui-col-md2 layui-col-lg2 layui-col-sm2 layui-col-xs2  layui-elip" >' + entrustTypeList[eval((page - 1) * 5 + i)] + ':编号:' + entrustIdList[eval((page - 1) * 5 + i)] + '</div>' +
                            '<div id="data-' + eval((page - 1) * 5 + i) + '" class="layui-col-md5 layui-col-lg5 layui-col-sm5 layui-col-xs5  layui-elip" onmouseover="xianshi(this)">' + entrustDataList[eval((page - 1) * 5 + i)] + '<i class="layui-icon">&#xe60b;</i></div>' +
                            '<div id="money-' + eval((page - 1) * 5 + i) + '" class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1 layui-elip" onmouseover="xianshi(this)">' + entrustMoney[eval((page - 1) * 5 + i)] + '</div>' +
                            '<div id="pname-' + eval((page - 1) * 5 + i) + '" class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1 layui-elip" onmouseover="xianshi(this)">' + entrustUserList[eval((page - 1) * 5 + i)] + '</div>' +
                            '<div id="ctime-' + eval((page - 1) * 5 + i) + '" class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1 layui-elip" onmouseover="xianshi(this)">' + entrustStartTime[eval((page - 1) * 5 + i)] + '</div>' +
                            '<div id="etime-' + eval((page - 1) * 5 + i) + '" class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1 layui-elip" onmouseover="xianshi(this)">' + entrustEndTime[eval((page - 1) * 5 + i)] + '</div>' +
                            '<div class="layui-col-md1 layui-col-lg1 layui-col-sm1 layui-col-xs1" >' +
                            '<button class="layui-btn layui-btn-normal layui-btn-sm" onclick="toThisEnt(' + entrustIdList[eval((page - 1) * 5 + i)] + ')">查看</button>' +
                            '</div>' +
                            '</div>'
                        )
                    }
                    next(lis.join(''), page < pages);
                }, 500);
            }
        });
    });
</script>
</body>
</html>
